import React from 'react';
import Logo from '../../components/logo/logo'
import { List, InputItem, WhiteSpace,WingBlank,Button } from 'antd-mobile';
import {Redirect } from 'react-router-dom'
import {connect} from 'react-redux'
import {login} from '../../redux/user-redux'

@connect(
state=>state.user,
{login}
)

class Login extends React.Component{
    
  constructor(props){
      super(props)
       this.state = {
           user:'',
           pwd: ''
       }
      this.register = this.register.bind(this)
      this.handleLogin = this.handleLogin.bind(this)
  }
      register(){
          console.log(this.props);
          this.props.history.push('/resgiter')
          
      }


      handleChange(key,val){
          this.setState({
              [key]:val
          })
      }
      handleLogin(){
          this.props.login(this.state)
      }
    render(){
        return (
            <div>
             {this.props.redirectTo ? <Redirect to={this.props.redirectTo} />:null}
               <Logo></Logo>
                <WingBlank>
                <List>
                {this.props.msg ? <p>{this.props.msg}</p> : null}
                <InputItem
                onChange = {v=>this.handleChange('user',v)}
                >用户</InputItem>
                <InputItem
                onChange = {v=>this.handleChange('pwd',v)}
                >密码</InputItem>
                 <Button type="primary" onClick={this.handleLogin}>登陆</Button>
                 <WhiteSpace />
                 <Button onClick = {this.register } type = "primary">注册</Button>
                 </List>
                </WingBlank>
               
            </div>
        )
    }
}

export default Login;